<nz-table #nzTable [nzData]="listOfData" nzTableLayout="fixed" [nzScroll]="{ x: 'auto' }"
          [(nzPageIndex)]="pageHelper.currentPage" (nzPageIndexChange)="nzPageHelperChange($event)"
          [(nzPageSize)]="pageHelper.pageSize" [nzTotal]="pageHelper.totalItems"
          [nzFrontPagination]="false">
  <thead>
  <tr>
    <th [nzChecked]="checked" [nzIndeterminate]="baseService.zorro.indeterminate"
        (nzCheckedChange)="baseService.zorro.onAllChecked($event)"></th>
    <th>编号</th>
    <th>账号</th>
    <!--    <th>IP</th>-->
    <!--    <th>操作地点</th>-->
    <th>操作结果</th>
    <th>类型</th>
    <th>操作系统</th>
    <th>状态</th>
    <th>操作日期</th>
    <th *ngIf="userInfo.roleId == roleIdEnum.SUPER_ADMINISTRATOR">请求参数</th>
    <th>操作</th>
  </tr>
  </thead>
  <tbody>
  <ng-container *ngFor="let data of nzTable.data let i =index">
    <tr>
      <td
        [nzChecked]="setOfCheckedId.has(data.id)"
        [nzDisabled]="data.disabled"
        (nzCheckedChange)="baseService.zorro.onItemChecked(data.id, $event)"
      ></td>
      <td>{{ i + 1 }}</td>
      <td nzEllipsis>{{ data.userName }}</td>
      <!--      <td nzEllipsis>{{ data.ip }}</td>-->
      <!--      <td nzEllipsis>{{ data.place }}</td>-->
      <td nzEllipsis>{{ data.remark }}</td>
      <td nzEllipsis>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 1">设备绑定</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 2">设备解绑</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 3">绑定礼品</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 4">解绑礼品</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 5">派发福利</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 6">远程启动</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 7">子账号操作</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 8">场地操作</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 9">套餐操作</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 10">网卡购买</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 11">退款操作</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 12">黑名单操作</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 13">商品操作</nz-tag>
        <nz-tag nzColor="#108ee9" *ngIf="data.type == 14">商品类型操作</nz-tag>
      </td>
      <td nzEllipsis>{{ data.system }}</td>
      <td nzEllipsis>
        <span *ngIf="data.status == 0" style="color: #16d407">操作成功</span>
        <span *ngIf="data.status == 1" style="color: red">操作失败</span>
      </td>
      <td nzEllipsis>{{ data.createTime | date: 'yyyy-MM-dd HH:mm:ss' }}</td>
      <td nzEllipsis  *ngIf="userInfo.roleId == roleIdEnum.SUPER_ADMINISTRATOR">
        <button [nzSize]="'small'" nz-button nzType="primary" (click) = "showModal(data)" >查看请求参数</button>
      </td>
      <td nzEllipsis>
        <a>
          <i nz-icon nzType="delete" nzTheme="twotone" [nzTwotoneColor]="'#F5222D'" nz-tooltip
             nzTooltipTitle="删除" nzTooltipPlacement="bottom"></i>
        </a>
      </td>
    </tr>
    <tr nzEllipsis [nzExpand]="baseService.zorro.expandSet.has(data.id)">
      <span>{{ data.details }}</span>
    </tr>
  </ng-container>
  </tbody>
</nz-table>

<nz-modal [(nzVisible)]="isVisible"
          [nzWidth]="560" [nzTitle]="'请求参数'"
          (nzOnOk)="handleCancel()"
          (nzOnCancel)="handleCancel()"
          [nzCancelText] = "null"
>
  <div style="text-align: center;font-size: 17px;color: #454545">{{param}}</div>
</nz-modal>
